<template>
  <div class="followRecord">
    <div class="title">
      <div>回款记录</div>
      <el-button type="primary"  @click="addClick" v-if="source == 'index'">新建</el-button>

    </div>
    <div class="content">
      <el-table
        v-loading="loading"
        ref="multipleTable"
        :data="tabList"
        stripe
        border
        tooltip-effect="dark"
        style="width: 100%"
      >
        <el-table-column label="序号" align="center" type="index" width="64px" />
        <el-table-column label="提交时间" prop="createTime"></el-table-column>
        <el-table-column label="付款时间" prop="payTime"></el-table-column>
        <el-table-column label="付款方式" prop="payType"></el-table-column>
        <el-table-column label="付款金额（元）" prop="payMoney" ></el-table-column>
        <el-table-column label="付款说明/备注" prop="remark" ></el-table-column>
        <el-table-column label="上传责任人" prop="nickName" ></el-table-column>
        <el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width" fixed="right" >
          <template slot-scope="scope">
            <el-button size="mini" type="text" @click="lookClick(scope.row)">查看</el-button>
            <el-button size="mini" type="text" @click="editClick(scope.row)" v-if="hasPermission == 1 && source == 'index'">编辑</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      ></pagination>
    </div>
    <RefundDialog v-bind="$attrs" v-if="dialogVisible" :clientId="queryParams.clientId" :refundId="refundId" :clientName="clientName" :pathType="pathType" :visible.sync="dialogVisible" @success="_handleSuccess">
    </RefundDialog>
  </div>
</template>
              
    <script>
import Loading from "@/components/Loading/index";
// api
import {
	recordList,
  editPermission,
} from "@/api/customer/customerFile";
import RefundDialog from "../components/RefundDialog";

export default {
  name: "detail",
  components: {
    RefundDialog,
  },
  data() {
    return {
      dialogVisible: false,
      pathType: 'add',
      tabList: [],
      loading: false, 
      total: 0,
      // 查询参数
      queryParams: {
        clientId: '',
        pageNum: 1,
        pageSize: 10,
      },
      clientName: '',
      source: '',
      refundId: '',
      hasPermission: '',//拥有客户回款编辑权限 1 有 2 无
    };
  },
  computed: {},
  created() {
    this.queryParams.clientId = this.$route.query.id;
		this.source = this.$route.query.pathType
    this.clientName = this.$route.query.clientName
    this.getPermission()
    this.getList();
  },
  methods: {
    //获取活动状态字典
    getStatusList() {
      var dictType = "equity_function_type";
      this.$getSelectList(dictType)
        .then((res) => {
          var arr = [
            {
              id: "",
              value: "全部",
            },
          ];
          this.functionTypeList = arr.concat(res.result[0].dictList);
        })
        .finally(() => {});
    },
    /** 查询列表 */
    getList() {
      this.loading = true;
      recordList(this.queryParams).then(response => {
        response.result.records.forEach(item => {
          for (var key in item) {
            if (item[key] === '') {
              item[key] = "-";
            }
          }
        });
        this.tabList = response.result.records;
        this.total = response.result.total;
        this.loading = false;
      });
    },
    getPermission(){
      editPermission().then( res => {
        this.hasPermission = res.result.hasPermission
      })
    },
    //新建
    addClick(){
      this.dialogVisible = true
      this.pathType = 'add'
    },
    //编辑
    editClick(row){
      this.refundId = row.id
      this.dialogVisible = true
      this.pathType = 'edit'
    },
    //查看
    lookClick(row){
      this.refundId = row.id
      this.dialogVisible = true
      this.pathType = 'look'
    },
    _handleSuccess(e) {
      //成功回调
      // this.resetQuery()
      this.getList()
    },
  },
};
</script>
<style lang="scss" scoped>
.followRecord {
  .title {
    height: 30px;
    line-height: 30px;
    font-size: 18px;
    color: #333;
    font-weight: bold;
    margin-bottom: 14px;
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}

</style>
              